<!-- 这个是角色列表页 -->
<extend name="Index/index" />
<block name="Main content">
    <!-- <div class="container"> -->
    <div style="padding:10px">
        <!-- <h1><span class="glyphicon glyphicon-user"></span> <{$title}></h1> -->
        <div class="mt20">
            <a href="<{:U('Ad/index')}>" class="btn btn-info">首页</a>
            <a href="<{:U('Role/add')}>" class="btn btn-success">添加</a>
        </div>
        <hr>

        
        <table class="table table-hover">
            <tr class="success">
                <th>ID</th>
                <th>角色名</th>
                <th>说明</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
            <volist name="rolelist" id="v">
            <tr>
                <td><{$v.id}></td>
                <td><{$v.name}></td>
                <td><{$v.remark}></td>

                <td><if condition="$v.status eq '0' "><button class="btn btn-danger deny" userid="<{$v.id}>"><span class="glyphicon glyphicon-remove"></span></button>
                <else/>
                <button class="btn btn-success deny" userid="<{$v.id}>"><span class="glyphicon glyphicon-ok"></span></button></if>
                </td>

                

                <td class="col-md-3">
                    <a href="<{:U('Role/edit',array('id'=>$v['id']))}>" class="btn btn-sm btn-primary">编辑</a>
                   <button class="btn btn-sm btn-danger del" rolename="<{$v.name}>" roleid="<{$v.id}>">删除</button>
                    <a href="<{:U('Role/nodelist',array('id'=>$v['id']))}>" class="btn btn-sm btn-info">分配权限</a>
                </td>

            </tr>

            </volist>
        </table>
        <div><{$page}></div>
        
    </div>
</block>

<block name="myjs">
    <script>



        $(document).ready(function(){
            // console.log(1);
            var deny = $('button.deny');
            for (var i = 0; i < deny.length; i++) {
                $(deny[i]).click(function(){
                    console.log($(this));
                    var userid = $(this).attr('userid');
                    // 判断button的状态
                    if ($(this).html() == '<span class="glyphicon glyphicon-ok"></span>') {
                        $.ajax({
                            type: 'get',
                            url: "<{:U('Role/role_status')}>",
                              data: 'id=' + $(this).attr('userid')+'&status=1',
                        });
                        $(this).html('<span class="glyphicon glyphicon-remove">').removeClass('btn-success').addClass('btn-danger');
                    } else {
                        $.ajax({
                            type: 'get',
                            url: "<{:U('Role/role_status')}>",
                            data: 'id=' + $(this).attr('userid')+'&status=0',
                        });
                        $(this).html('<span class="glyphicon glyphicon-ok"></span>').removeClass('btn-danger').addClass('btn-success');
                    };

                                
                    return false; //阻止跳转
                });
            }; // 状态点击事件结束

                         //删除的ajax
            var dellist = $('button.del');
            // console.log(1);
                for (var i = 0; i < dellist.length; i++) {
                    $(dellist[i]).click(function(){
                        console.log(1);
                        var rolename = $(this).attr('rolename');
                        if (confirm('您确认删除角色:'+rolename)) {
                        var mythis = $(this);
                        console.log(mythis.attr('roleid'));
                        // 开启ajxa
                        $.ajax({
                            type:'get',
                            url:"<{:U('Role/del')}>",
                            data:'id=' + mythis.attr('roleid'),
                            success:function(msg){alert(msg);
                            if (msg == '删除成功') {
                                mythis.parent().parent().remove();
                                }
                            },
                        });
                        };
                        
                    })
                };  //删除功能结束
        });
    </script>
</block>